<template>
	<div class="appInvitation" :class="this.$store.getters.isIphoneX ? 'pad-top80' : 'pad-top'">
		<back-header title="邀请好友"></back-header>
		<div class="invitation-warp">
			<div class="invitation_content">
				<img class="img" src="../assets/images/wawalogo.png">
				<div class="info">
					每邀请一个好友,您将获得30金币奖励,最多可以获得300金币。
				</div>
				<b class="code"></b>
			</div>
			<button class="btn share_wx btn-yellow" @click="toShare">分享</button>
		</div>
	</div>
</template>

<script type="text/javascript">
	import backHeader from '../components/backHeader'
	export default{
		name:"appInvitation",
		components:{backHeader},
		methods:{
			toShare(){
				window.mqq.ui.showShareMenu();
			}
		}
	}
</script>

<style lang="less" scoped>
	.invitation-warp {
		width:100%;
	}
	.invitation_content {
	    width: 80%;
	    margin: 0 auto;
	    background: #fff;
	    border: 1px solid #dedede;
	    border-radius: 5px;
	    position: relative;
	    padding: 50px 10px;
	    text-align: center;
	    margin-top: 80px
	}
	.invitation_content .img {
	    position: absolute;
	    width: 150px;
	    top: -25px;
	    left: 50%;
	    margin-left: -75px;
	}

	.invitation_content .info {
	    color: #6d6d6d;
	    font-size: 14px;
	    line-height: 25px
	}
	.invitation_content .code {
	    color: #fb9d01;
	    font-size: 30px;
	    margin-top: 30px;
	    display: block
	}
	.invitation-warp .btn{
	    display: block;
	    width: 80%;
	    margin: 0 auto;
	    border: 0;
	    color: #666;
	    font-size: 16px;
	    height: 45px;
	    border-radius: 5px;
	    margin-top: 40px
	}
</style>